<template>
  <div>
    <BabySearch
      :key="babySearchId"
      v-model="babyInfo"
      :tab-name="tabName"
      :baby-id="`${babyId}`"
    />
    <div style="height:20px"></div>
    <commonDiseaseBottomCard></commonDiseaseBottomCard>
    <babySubmitBtn @click.native="submitUser">
      下一步
    </babySubmitBtn>
  </div>
</template>

<script>
import BabySearch from '@/components/evaluation/BabySearch';
import commonDiseaseBottomCard from '@/components/advisory/commonDiseaseBottomCard/commonDiseaseBottomCard';
import babySubmitBtn from '@/components/common/babySubmitBtn/babySubmitBtn';
import toast from '@/toast';
import {menusNavigation} from '@/store';

export default {
  name: 'CommonDisease',
  components: {
    BabySearch,
    commonDiseaseBottomCard,
    babySubmitBtn
  },
  props: {
    tabName: {
      type: String,
      required: true
    },
    babyId: {
      type: Number,
      default: 0
    },
    babySearchId: {
      type: Number,
      default: 0
    }
  },
  data() {
    return {
      babyInfo: {}
    };
  },
  methods: {
    submitUser() {
      if (this.babyInfo.id) {
        this.$emit('next', this.babyInfo, 1);
      } else {
        const allIsCheck =
          this.babyInfo.child_name &&
          this.babyInfo.birthday &&
          this.babyInfo.sex;
        if (!this.babyInfo.child_name) {
          toast('请填写宝宝姓名');
          return;
        }
        if (!this.babyInfo.birthday) {
          toast('请填写宝宝生日');
          return;
        }
        if (!this.babyInfo.sex) {
          toast('请选择宝宝性别');
          return;
        }
        this.$http
          .post(this.$url.addChild, this.babyInfo)
          .then(res => {
            this.$emit('next', {id: res.u_id}, 1);
            this.babyInfo = {
              isClear: true
            };
            const tab = menusNavigation.tabs.find(
              tab => tab.tab === this.tabName
            );
            tab.isEditing = false;
          })
          .catch(this.$catch);
      }
    }
  }
};
</script>
